<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>商品详情页</title>
    <link rel="stylesheet" href="../scss/commodityDetails.css">
    <link rel="stylesheet" href="../scss/iconfont.css">
</head>
<body>
    <!-- 购买区 -->
    <div class="head">
        <div class="picture">
            <div class="picture1">
                <div class="smallGlass"></div>
                <img src="" class="img">
            </div>
            <div id="productDetails">
                {{each productDetails}}
                <img src={{$value.url}} class="littleImg" onclick="glass({{$value.seq}})">
                {{/each}}
            </div>
        </div>
        <div class="purchaseInformation">
            <p class="purchaseName">商品名</p>
            <p class="purchasePrice">价格<span>198</span></p>
            <div class="purchaseSize">
                <span>尺寸</span>
                <div>s</div>
                <div>m</div>
                <div>l</div>
            </div>
            <div class="purchaseColor">
                <span>颜色</span>
                <div>白</div>
                <div>红</div>
                <div>白</div>
            </div>
            <div class="purchaseAmount">
                <span>数量</span>
                <button class="minus">-</button>
                <input type="number" class="num1" value="1">
                <button class="plus">+</button>
            </div>
            <div class="bigGlass">
                <div class="wrap">
                    <img src="" class="bigImg">
                </div>
            </div>
        </div>
    </div>
    <!-- 图片区 -->
    <div class="pictureParticulars">
        <div  class="morePicture" id="morePicture">
            {{each singleDetails}}
            <img src={{$value.photo.url}}>
            {{/each}}
        </div>
    </div>
    <div id="box" class="box">
        <div class="box-in"></div>
    </div>
    <!-- 购买区 -->
    <div class="footer">
        <div class="back"><span class="iconfont icon-huidaozhuye"></span><span>返回首页</span></div>
        <div class="collect">
            <span class="iconfont icon-jushoucang circle"></span>
            <span>收藏</span>
        </div>
        <div class="shopCart"><span class="iconfont icon-31gouwuchexuanzhong"></span><span>加入购物车</span></div>
        <div class="skip"><span class="iconfont icon-goumai"></span><span>立即购买</span></div>
    </div>
    <script src="../js/rem.js"></script>
    <script src="../js/jquery-3.6.0.js"></script>
    <script src="../js/template-web.js"></script>
    <script src="../js/commodityDetails.js"></script>
</body>
</html>